
<%@page import="com.ps.global.Globals"%><%@ include file="/common.jsp"%>  
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
		<title>酱出名门人事工资管理平台</title>

		<link type="text/css"
			href="${ctx}/js/dhtmlxTree/dhtmlxtree.css" rel="stylesheet" />
		<script type="text/javascript" src="${ctx}/js/dhtmlxTree/dhtmlxcommon.js"></script>
		<script type="text/javascript" src="${ctx}/js/dhtmlxTree/dhtmlxtree.js"></script>
		<script type="text/javascript" src="${ctx}/js/pageing.js"></script>
	</head>

	<BODY>
		<div class="main">
			<%@include file="/head.jsp"%>
			<div class="nav">
				<ul>
					<li>
						<a href="deptAction.action">部门管理</a>
					</li>
					<li class="nav_pic"></li>	

                    <li style="float: right;margin-right: 5px">
                        <label >录入者</label>
						<a href="#" id="labelInputer"></a>
					</li>
				</ul>
				
			
			</div>
	 		<div class="left" style="width:250px;height:400px;">
	 		  <ul >
		        <li style="background-color:#5e7291;">
	            	<input type="text" id="edit_search" style="width:150px;" /><button id="btn_search">搜索</button>   
                </li>	
	            <li  style="background-color:#5e7291;">
	            <button id="btn_add" style="margin-left: 20px">添加</button><button id="btn_edit" style="margin-left: 5px">编辑</button><button id="btn_del" style="margin-left: 5px">删除</button></tr></table>
	           
                 </li>			
				
			
				<%--	 		  
	 		  
	 		  
	 		  <li style="background-color:#5e7291;color:#fff;text-align:center;font-size:14px;font-weight:800;">功能列表</li>
	 		  --%></ul>
			  <div id="dept_xmltree" style="width: 250px;height: 320px" ></div>
	       </div>			
	
	 		
	 <div class="right" style="width:750px;height:400px;margin-left: 5px">
	  
		<s:form action="deptAction!update.action" theme="simple" onsubmit="return deptUpdate()">
		 <table>
		 	<tr><td><label>名称:</label></td><td><s:textfield name="department.name" ></s:textfield></td></tr>

			<tr><td><label>区域:</label></td><td><s:textfield name="areaName"  readonly="true"></s:textfield></td></tr>
			<tr><td><label>岗位:</label></td><td><s:textfield name="workPositionNames" readonly="true"></s:textfield></td></tr>
			<tr><td><label>备注:</label></td><td><s:textarea name="department.remark" 
			rows="3" cssStyle="width:200px;margin-top: 10px;font-size:12px;"
			></s:textarea></td>
			</tr><tr><td ><label >录入时间:</label></td><td ><label id="labelInTime" style="width:200px;float:left;margin:20px 0 0 0;text-align: left"></label></td></tr>
			<tr><td></td><td><s:submit value="提交" cssStyle="width:60px" ></s:submit>
			<s:reset value="重置" cssStyle="width:60px;margin-left: 5px" ></s:reset></td></tr>
		</table>
		<s:hidden name="department.areaId" ></s:hidden>
		<s:hidden name="department.departmentId" ></s:hidden>
		<s:hidden name="workPositionIds" ></s:hidden>
		</s:form>
	</div>

	<div class="clear"></div>
			<div class="footer">
				酱出名门人事工资管理平台 版权所有
			</div>
		</div>

		
		<div id="dialogAreaList" title="请选择区域" style="display: none">
			<ul  style="list-style-type: none;margin: 0px;width: 100%" >
			</ul>
		</div><%--		
		<div id="dialogHaveWP" title="所属岗位" style="display: none">
			<table id="tableHaveWP" style="width: 100%;">
		        <tbody>
			    </tbody>
			</table>   
		</div>			
		--%>
		<div id="dialogAllotWP" title="分配岗位" style="display: none">
			<table id="tableAllotWP" style="width: 100%;">
		        <tbody>
			    </tbody>
			</table>   
		    <div style="float:left;margin-left:22px; width: 98%">  
				<div style='float: left; line-height: 28px;vertical-align: middle'>
						<span id="page_info"></span>
                    	<a id="page_first" herf="#">首页</a> 
                     	<a id="page_prev" herf="#">上一页</a> 
                        <a id="page_next" herf="#">下一页</a> 
                        <a id="page_last" herf="#">尾页</a>
                        <input id="page_num" type="text" class="text ui-widget-content ui-corner-all" style="height:24px;line-height:24px;width:20px;padding: 0px">
                        <a id="page_goto" herf="#">转</a> 
			   </div>
		    </div>			
			
		</div>		


	</body>
	
	
	
	<script type="text/javascript" >
        var deptOneLevel = <%=Globals.DEPT_ONE_LEVEL%>;
		var deptId;
	
	    //加载树形菜单 
		tree = new dhtmlXTreeObject("dept_xmltree", "100%", "100%", 0);
		tree.setSkin('dhx_skyblue');
		tree.setImagePath("${ctx}/js/dhtmlxTree/imgs/csh_bluebooks/");
		tree.enableCheckBoxes(0);
		//tree.enableThreeStateCheckboxes(false);
		tree.loadXML("deptAction!getXmlTree.action");
		tree.setOnClickHandler(queryDeptById);
		var pageObjRef = new pageObj(findWPByPage);

		$(function(){

			$('#dialogAreaList').dialog({
				autoOpen: false,
				width: 200,
				modal: true,
				buttons: {
					"确定": function() {

				        var areaId = $("input[name='checkArea']:checked").val();
				        $("input[name='department.areaId']").val(areaId);
				        $("input[name='areaName']").val($("input[name='checkArea']:checked").data("areaName"));
						$( this ).dialog( "close" );
					},
					"取消": function() {
						$( this ).dialog( "close" );
					}
				}
			});   

			/*$('#dialogHaveWP').dialog({
				autoOpen: false,
				width: 200,
				modal: true,
				buttons: {
					"确定": function() {
						$( this ).dialog( "close" );
					},
					"取消": function() {
						$( this ).dialog( "close" );
					}
				}
			});*/   

            var isSelected = false;
			$('#dialogAllotWP').dialog({
				autoOpen: false,
				width: 600,
				
				modal: true,
				buttons: {
					"确定": function() {
						isSelected = true;
						$( this ).dialog("close");
					},
					"取消": function() {
						isSelected = false;
						$( this ).dialog("close");
					}
				},
				close:function(event, ui) {
	            	var wpIds = $("input[name='workPositionNames']").data("wpIds");
	            	var wpNames = $("input[name='workPositionNames']").data("wpNames");
	            	//alert(isSelected);
					if (isSelected) {
			    	    $("input[name='workPositionNames']")
			    	    	.data("firstWpIds", wpIds.concat())
			    	    	.data("firstWpNames", wpNames.concat());
			    	   
				    } else {
				    	wpIds =  $("input[name='workPositionNames']").data("firstWpIds");
				    	wpNames = $("input[name='workPositionNames']").data("firstWpNames");
			    	    $("input[name='workPositionNames']")
			    	        .data("wpIds", wpIds.concat())
	    	    			.data("wpNames", wpNames.concat());

		    	    	
					}
					//alert(JSON.stringify(wpIds));
					$("input[name='workPositionNames']").val(wpNames.join(";"));
					$("input[name='workPositionIds']").val(JSON.stringify(wpIds));
	            	isSelected = false;
					
			    }

			
			});  			

			$("input[name='workPositionNames']").click(allotWP);  

			$("#btn_add").click(jumpToAdd);
			


		});  

		function jumpToAdd() {
            if (deptId == null) {
                alert("请选择一个部门!");
                return;
            }
			window.location.href="deptAction!jumpTo.action?jump=add&fatherId=" + deptId;
		}
		
        function deptUpdate() {
            var name = $.trim($("input[name='department.name']").val());
            
            if (name == "") {
                alert("部门名称不能为空!");
                return false;
            }
            
            
            

            return true;
        }
		
        function queryDeptById(tid) {

        	deptId = tid;
        	
            if (tid == -1) return;

            $("input[name='department.departmentId']").val(deptId);
           
        	$.ajax({
     		   type: "POST",
     		   url: "deptAction!getById.action",
     		   data: "departmentId=" + tid,
     		   success: function(msg){
        			queryDeptByIdCallback(msg.datas);
     		   },
     		   error:function (textStatus) {
         		  alert(textStatus); 
         	   }
            });
       }

       function queryDeptByIdCallback(datas) {
    	   $("input[name='department.name']").val(datas.name);
    	   $("input[name='areaName']").val(datas.area.name);
    	   $("input[name='department.areaId']").val(datas.areaId);
           if (datas.workPositions.length > 0) {
        	   fillWorkPositionNames(datas.workPositions);
        	   
        	   
           } else {
        	   $("input[name='workPositionIds']").val("");
        	   $("input[name='workPositionNames']").val("");
        	   $("input[name='workPositionNames']").data("wpIds", new Array())
        	   		.data("wpNames", new Array())
        	   		.data("firstWpIds",  new Array())
        	   		.data("firstWpNames",  new Array());
           }

   	   	   
    	   $("textarea[name='department.remark']").val(datas.remark);

    	   $("#labelInTime").html(datas.inTime);
           $("#labelInputer").html(datas.inputerName);
           var fid = datas.fatherId;
           if (fid == deptOneLevel) {
               $("input[name='areaName']").click(function() {
                   var selectId = tree.getSelectedItemId();  
                   if (selectId == null || selectId == "" || selectId == -1) {
                       return;
                   } else {
                   		findAllArea();
                   }
    			});
           } else {
               $("input[name='areaName']").unbind(); 
           }
           
       }


       function fillWorkPositionNames(datas) {
    	   var names = "";
    	   var wpIds = new Array();
    	   var wpNames = new Array();
    	   $.each(datas, function(i, item){  
    		   
    		   wpIds[i] =  item.wpId;
    		   wpNames[i] = item.name;
 
    		});
    	    $("input[name='workPositionNames']").val(wpNames.join(";"));
    	    $("input[name='workPositionIds']").val(JSON.stringify(wpIds));
    	    $("input[name='workPositionNames']").data("wpIds", wpIds)
    	    	.data("wpNames", wpNames)
	    	    .data("firstWpIds", wpIds.concat())
	    	    .data("firstWpNames", wpNames.concat());

			
       }

       function allotWP() {
    	   pageObjRef.findByPage(0);

       }



       function showWPS(datas) {
    	   $("#tableAllotWP tbody tr").remove();
    	   var wpIds = $("input[name='workPositionNames']").data("wpIds");
           
           var mworkPositions = datas.items;
    	   
    	   $.each(mworkPositions, function(i, item){  
    		   var tr = $("<tr></tr>");
    		    
               var td = "<td></td>";
        
               var checkbox = $("<input type='checkbox' />");
               checkbox.data("selectId", item.wpId);
               checkbox.data("selectName", item.name);
               if ($.inArray(item.wpId, wpIds) != -1) {
            	   checkbox.attr("checked", "checked");
               }  
               checkbox.click(function () {
            	   var wpIds = $("input[name='workPositionNames']").data("wpIds");
            	   var wpNames = $("input[name='workPositionNames']").data("wpNames");
			       if ($(this).attr("checked")) {
	            	   if ($.inArray($(this).data("selectId") ,wpIds) == -1) {
	            		   wpIds.push(item.wpId);
	            		   wpNames.push(checkbox.data("selectName"));
	                   }
				   } else {
					   var index = 	$.inArray($(this).data("selectId"),  wpIds);
					   if (index >= 0) {
						   wpIds.splice(index, 1);
						   wpNames.splice(index, 1);
					   }
				   }				   
               }); 

               
               
               tr.append($(td).html(item.name)).data("index", i);
               tr.append($(td).html(item.performanceScore));
               tr.append($(td).append(checkbox));
               /*tr.append($(td).html("移除").click(function () {
            	   $(this).parent().remove();
               }));*/
              
               $("#tableAllotWP tbody").append(tr);
    	   });


    	   pageObjRef.setPageBtnClick(datas);
    	   pageObjRef.setPageInfo(datas);
    	   
     	   $('#dialogAllotWP').dialog('open');
           
       }


   	   function findWPByPage(startIndex) {
                
            if (deptId == -1) return;
   		   
			pageObjRef.startIndex = startIndex;

			$.ajax( {
				type : "POST",
				url : "workPositionAction!findByPage.action?departmentId=" + deptId,
				data : "paginationJson=" + JSON.stringify(pageObjRef)
				    +  "&findByPageType=1"
					+ "&timestamp=" + new Date().getTime(),
				success : function(msg) {
					findByPageCallback(msg);
				},
				error : function(textStatus) {
					alert("网络异常请稍后重试!");
				}
			});
	   }
       
       function findByPageCallback(msg) {
           switch (msg.status.code) {
           case "SUCCES" :
        	   showWPS(msg.datas);
               break;
           case "FAIL" :
           	alert(msg.status.message);
               break;
           case "EMPTY" :
           	alert(msg.status.message);
               break;    
           }
       }
       
       function findAllArea() {
   		$.ajax( {
   			type : "GET",
   			url : "areaAction!findAllArea.action",
   			success : function(msg) {
   				findAllAreaCallback(msg);
   			},
   			error : function(textStatus) {
   				alert("网络异常请稍后重试!");
   			}
   		});
     }

     function findAllAreaCallback(msg) {
         switch (msg.status.code) {
         case "SUCCES" :
       	  showAreas(msg.datas);
             break;
         default :
         	 alert(msg.status.message);
            break; 
         }
     } 

     function showAreas(datas) {
   	  	$("#dialogAreaList ul").html("");

        var areaId =  $("input[name='department.areaId']").val();
   	  	for ( var i = 0; i < datas.length; i++) {
          	var li = $("<li ></li>"); 
          	var input;
          	if (datas[i].areaId == areaId) {
          		input = $("<input type='radio' name='checkArea' checked='checked'/>");
            } else {
            	input = $("<input type='radio' name='checkArea' />");
            }
          	input.data("areaName", datas[i].name);
   		  	input.val(datas[i].areaId);
   		  	var label = $("<label></label>")
   		  	label.html(datas[i].name);
            li.append(input).append(label);
   		  	$("#dialogAreaList ul").append(li);
   	  	}

   	 	$('#dialogAreaList').dialog('open'); 
   	 	return false;  
     }  

		
	</script>	
	
	
</html>
